// 注意import和export命令只能在模块的顶层，不能在代码块之中,应该有导出才有导入
//import()可以在需要的时候，再加载某个模块，属于异步加载
//import()可以放在if代码块，根据不同的情况，加载不同的模块

//方式一：导入组件
// import movie from "../../views/Movie"
// export default {
//     path:'/movie',
//     component:movie
// }


//方式二，按需导入
export default {
    path:'/movie',
    // component:function(){
    //     return import("../../views/Movie")
    // }
    component:()=>import('@/views/Movie'),//@表示根路径，这个是按需导入
    children:[
        
        { path:'city',
        component:()=>import('@/components/City')
        },
        { path:'search',
        component:()=>import('@/components/Search')
        },
        { path:'playing',
        component:()=>import('@/components/Playing')
        },
        { path:'soonplay',
        component:()=>import('@/components/Soonplay')//利用router-view渲染
        },
        {
           
            path:"detail/1/:id",
            components:{
                //默认路由
                default:()=>import('@/components/Playing'),
                //我们给router-view起名name，既是视图命名
                detail:()=>import('@/views/Movie/detail'),
             
            },
            //路由组件传参
               props:{
                default:false,
                detail:true
            }
        },
        {
           
            path:"detail/2/:id",
            components:{
                //默认路由，这样可以保留原来的路由
                default:()=>import('@/components/Soonplay'),
                //我们给router-view起名name，既是视图命名
                detail:()=>import('@/views/Movie/detail'),   
            },
            //路由组件传参
              props:{
                default:false,
                detail:true
            }
        },
         //路由重定向
         {
            path:'/movie',
            redirect:'/movie/playing'
        }
    ],
   
      
    
    

    
}
